<template>
    <view class="skeleton page">
        <view class="skeleton-list">
            <view class="skeleton-list-item" v-for="(item,index) in list" :key="index">
                <view class="skeleton-list-item-left"></view>
                <view class="skeleton-list-item-right"></view>
            </view>
        </view>
    </view>
</template><script>
    export default {
        name:'history',
        data(){
            return{
                list:[{},{},{},{},{},{},{},{},{},{},{},]

            }
        }
    }

</script>

<style lang='scss' scoped>
    .skeleton {
        position: fixed;
        height: 100%;
        overflow: hidden;
        box-sizing: border-box;
        background: #fff;
        width: 100%;
    }
    .skeleton-list{
        margin: 0 20upx;
        &-item{
            display:flex;
            padding: 50upx 0 40upx;
            justify-content:space-between;
            align-items: center;
            &-left{
                flex: 1;
                height:60upx;
                background:#eee;
                width:60%;
            }
            &-right{
                background:#eee;
                height:50upx;
                margin-left: 20upx;
                width:30%;
            }
        }
    }
</style>